<template>
    <main-layout>
        <div class="mine-main">
            <header-layout pagename="我的" />

            <!-- 用户信息，我的订单，服务 -->
            <div class="info-order-serve">
            <!-- 用户信息、资产 -->
                <div class="info">
                    <div class="sub-info">
                        <div class="head-portrait"><img src="../../images/sort/2.sort_03-06.jpg" alt=""></div>
                        <div class="user-info">
                            <p>用户名</p>
                            <div class="assets">
                                <div @click="goCoupon">
                                    <span>1</span>
                                    <span>优惠劵</span>
                                </div>
                                <div>
                                    <span>0元</span>
                                    <span>资产</span>
                                </div>
                            </div>
                        </div>
                    </div>

                </div>
                <!-- 我的订单 -->
                <div class="my-order">
                    <div class="all">
                        <span>我的订单</span>
                        <span>查看全部></span>
                    </div>
                    <div class="icfont">
                        <div v-for="icon in myOrderList" :key="icon.id">
                            <span>
                                <svg class="icon" aria-hidden="true">
                                  <use :xlink:href="icon.ico"></use>
                                </svg>
                            </span>
                            <span>{{icon.name}}</span>
                        </div>
                    </div>
                </div>
                <!-- 我的服务 -->
                <div class="my-service">
                    <div class="service">我的服务</div>
                    <div class="service-icofont">
                        <div v-for="serviceIco in myServiceList" :key="serviceIco.id">
                            <span>
                                <svg class="icon" aria-hidden="true">
                                  <use :xlink:href="serviceIco.ico"></use>
                                </svg>
                            </span>
                            <span>{{serviceIco.name}}</span>
                            <span>
                                <svg class="icon" aria-hidden="true">
                                  <use xlink:href="#icon-xiayiyeqianjinchakangengduo"></use>
                                </svg>
                            </span>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </main-layout>
</template>
<style lang="less" scoped>
    @import '../../style/mine.less';
</style>

<script>
    export default {
        data(){
            return {
                myOrderList:[
                    {
                        ico:'#icon-31daifukuan',
                        name:'待付款'
                    },
                    {
                        ico:'#icon-31daifahuo',
                        name:'待发货'
                    },
                    {
                        ico:'#icon-daitihuo',
                        name:'待提货'
                    },
                    {
                        ico:'#icon-31daipingjia',
                        name:'待评价'
                    },
                    {
                        ico:'#icon-tuihuoshouhou',
                        name:'退货/售后'
                    }
                ],
                myServiceList:[
                    {
                        ico:'#icon-kefuxiaoxi',
                        name:'在线客服'
                    },
                    {
                        ico:'#icon-shoucang',
                        name:'地址信息'
                    },
                    {
                        ico:'#icon-hezuohuoban',
                        name:'批发加盟'
                    },
                    {
                        ico:'#icon-shezhi',
                        name:'设置'
                    }
                ]
            }
        },
        methods: {
            goCoupon(){
                this.$router.puth
            }
        },
    }
</script>
